<!DOCTYPE html>
<html>
<head>
    <title>Adaptive Usage</title>
    <meta charset="utf-8">
    <link href="../content/shared/styles/examples-offline.css" rel="stylesheet">
    <link href="../../styles/kendo.common.min.css" rel="stylesheet">
    <link href="../../styles/kendo.rtl.min.css" rel="stylesheet">
    <link href="../../styles/kendo.default.min.css" rel="stylesheet">
    <link href="../../styles/kendo.dataviz.min.css" rel="stylesheet">
    <link href="../../styles/kendo.dataviz.default.min.css" rel="stylesheet">
    <script src="../../js/jquery.min.js"></script>
    <script src="../../js/kendo.all.min.js"></script>
    <script src="../content/shared/js/console.js"></script>
    <script>
        
    </script>
    
    
</head>
<body>
    
        <a class="offline-button" href="../index.html">Back</a>
    
    <div id="example">
    <div class="demo-section k-header">
        <div class="todo-head"></div>
        <div id="touch-scroller" style="height: 200px">
            <ul id="flat-listview"></ul>
        </div>
    </div>
    <style scoped>
        .demo-section {
            width: 400px;
            padding: 0;
        }
        .todo-head {
            height: 80px;
            background: url('../content/web/scroller/title.png') no-repeat 50% 50%;
            border-bottom: 1px solid #e7e7e7;
        }
    </style>
</div>

<script>
    $(function() {
        var flatData = [ "Sashimi salad", "Chirashi sushi", "Seaweed salad", "Edamame", "Miso soup", "Maguro", "Shake", "Shiromi", "Tekka maki", "Hosomaki Mix", "California rolls", "Seattle rolls", "Spicy Tuna rolls", "Ebi rolls", "Chicken Teriyaki", "Salmon Teriyaki", "Gohan", "Tori Katsu", "Yaki Udon" ];

        $("#touch-scroller").kendoMobileScroller();
        $("#flat-listview").kendoMobileListView({ dataSource: flatData });
    });
</script>


    
    
</body>
</html>
